<template>
  <input
    type="text"
    :id="filter"
    :lay-filter="filter"
    placeholder="--请选择--"
    autocomplete="off"
    class="layui-input"
  />
</template>
<script>
export default {
  name: "SelectTree",
  props: {
    event: "",
    treeDataUrl: "",
    autoLoad: Boolean,
    filter:"",
  },
  mounted: function () {
    if (this.autoLoad) {
      this.init();
    }
  },
  methods: {
    callParent: function () {
      var that = this;
      var parentTree = this.$parent[this.event](this.filter);
      var tree = {
        type: "post",
        elem: "#"+this.filter,
        data: that.treeDataUrl,
      };
      tree = $.extend(parentTree, tree);
      layui.use(["treeSelect"], function () {
        var treeSelect = layui.treeSelect;
        treeSelect.render(tree);
      });
    },
    getSelectedNodes: function (filter) {
      var values;
      layui.use("treeSelect", function () {
        var treeSelect = layui.treeSelect;
        var treeObj = treeSelect.zTree(filter);
        values = treeObj.getSelectedNodes();
      });
      return values;
    },
    checkNode: function (filter,id) {
      layui.use("treeSelect", function () {
        var treeSelect = layui.treeSelect;
        return treeSelect.checkNode(filter, id);
      });
    },
    init: function () {
      this.callParent();
    },
  },
};
</script>
<style>
.layui-treeSelect .ztree li span.button.bottom_close::before,
.layui-treeSelect .ztree li span.button.center_close::before,
.layui-treeSelect .ztree li span.button.roots_close::before,
.layui-treeSelect .ztree li span.button.root_close::before {
  content: "\e623";
}
.layui-treeSelect .ztree li span.button.bottom_open::before,
.layui-treeSelect .ztree li span.button.roots_open::before,
.layui-treeSelect .ztree li span.button.center_open::before,
.layui-treeSelect .ztree li span.button.root_open::before {
  content: "\e625";
}
</style>